 
<div class="mui-content mui-content-my contact">
    <div class="search">
        <form  method="POST" action="">
        <input type="text" name='username' placeholder="搜索">
        </form>
    </div>
    <!-- <div class="contactNav" id="a">A</div> -->
    <ul>
         {volist name="list" id="v"}  
        <li class="mui-table-view-cell mui-checkbox mui-left">
            <input name="checkbox[]" type="checkbox" value='{$v.username}'>
            <img src="{$v.avatar}" alt="">{$v.username}
        </li>
           {/volist} 
    </ul>
    
   <!--  <div class="contactNavList">
        <a href="#a">A</a>
        <a href="#b">B</a> 
    </div> -->
</div> 
<script src="__CDN__/style/js/jquery-1.11.3.js"></script>
<script>
var callbackdata = function () {
    var dd = [];  
    $.each($('input:checkbox:checked'),function(){
        dd.push($(this).val());
    }); 
    return dd;
} 
</script>
<script>
    $(function () {
        var contactNavList=$('.contactNavList');//导航元素
        var a=$(window).innerHeight();//窗口高度
        var b=parseInt(contactNavList.css('height'));//窗口高度
        contactNavList.css('top',(a+50-b)/2);

        // 点击滚动到指定位置
        $('.contactNavList a').click(function (e) {
            e.preventDefault();
            var id=$(this).attr('href').substring(1);
            var jump=$("#"+id);
            var t =jump.offset().top-50;
            $('body,html').animate({"scrollTop":t},500);
            $(this).addClass('contact-active').siblings().removeClass('contact-active');
        })
    })
    $(window).scroll(function(){

        var $sections = $('.contactNav'); // 获取所有的内容块
        var currentScroll = $(this).scrollTop();  // winodw滚动的高度
        var $currentSection ;   //   当前内容块
        //console.log(currentScroll);
        $sections.each(function(){
            var divPosition = $(this).offset().top;// 获取到当前内容块具体页面顶部的距离
            if(divPosition-currentScroll<100){  //  通过条件判断匹配到当前滚动内容块
                $currentSection = $(this);
            }
            // 如果楼层最上端有其它的内容快需要加一个判断
            if(currentScroll > 0){
                var id = $currentSection.attr('id');
                $('.contactNavList a').removeClass('contact-active');
                $(".contactNavList a[href='#"+id+"']").addClass('contact-active');
            }
        })
    });
</script>
 